import React, { useEffect, useState } from 'react';
import { Card } from 'antd';
import { marked } from 'marked';
import axios from 'axios';

const Home: React.FC = () => {
  const [content, setContent] = useState('');

  useEffect(() => {
    axios.get('../README.md').then(res => setContent(res.data));
  }, []);

  return (
    <Card style={{ backgroundColor: '#f5f5f5', border: '1px solid #d9d9d9' }}>
      <div dangerouslySetInnerHTML={{ __html: marked(content) }} />
    </Card>
  );
};

export default Home;